{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    {#	<meta name="viewport" content="width=device-width, initial-scale=1">{# 可在移动设置显示 #}
    <title>用户管理系统</title>
    {#    样式#}
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
    <link rel="shortcut icon" href="#"/>
    <style>
        .navbar {
            border-radius: 0;
        }
    </style>
    <style type="text/css">
        .active {
            color: #f00;
        }
    </style>


    {% block css %}
        {#	置入css#}
    {% endblock %}

</head>
<body>

{#导航条#}
<nav class="navbar navbar-default">
    <div class="container">{# 去除-fluid居中显示 #}
        {#    管理#}
        <div class="navbar-header">
            <a class="navbar-brand" href="#">联通用户管理系统</a>
        </div>
        {#    登录操作#}

        <div class="collapse navbar-collapse " id="bs-example-navbar-collapse-1">

            <ul class="nav navbar-nav ">

                <li id="menuA"><a href="/depart/list/" onclick="clickMe();">部门管理</a></li>
                <li id="menuB"><a href="/user/list/" onclick="clickMe();">用户管理</a></li>
                <li id="menuC"><a href="/pretty/list/">靓号管理</a></li>
                <li id="menuD"><a href="/task/list/">任务管理</a></li>
                <li id="menuE"><a href="/order/list/">订单管理</a></li>
                <li id="menuF"><a href="/chart/list/">数据统计</a></li>
                <li id="menuF"><a href="/city/list/">城市列表</a></li>

                {#下拉菜单#}
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                       aria-expanded="false">上传文件 <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li id="menuG"><a href="/upload/form/">Form上传</a></li>
                        <li id="menuH"><a href="/upload/modelform/">ModalForm上传</a></li>
                    </ul>
                </li>

            </ul>

            <ul class="nav navbar-nav navbar-right">
                <li><a href="/admin/list/">帐户管理</a></li>

                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                       aria-expanded="false">{{ request.session.info.name }}<span class="caret"></span></a>
                    {#												在account.py中定义的session#}
                    <ul class="dropdown-menu">
                        <li><a href="#">个人资料</a></li>
                        <li><a href="#">我的信息</a></li>
                        <li role="separator" class="divider"></li>
                        {# 横隔条 #}
                        <li><a href="/logout/">注销</a></li>
                    </ul>
                </li>
            </ul>
        </div>

    </div>
</nav>

<div>


    {# 这是母板 #}
    {% block content %}

        {# 其它页面就把不一样的写在这里 #}

    {% endblock %}


</div>

<script src="{% static 'js/jquery-3.6.1.min.js' %}"></script>
<script src="{% static 'plugins/bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
{% block js %}
    {#置入js#}
{% endblock %}

</body>

<script type="text/javascript">

    $(function () {
        changeColor();
    })

    function changeColor() {
        //这个事件的目的是：当我们点击时要怎么处理
        $('#menuA').click(function (obj) {
            //因为JS会把HTML标签当做一个对象
            //对象.属性 = 值;
            obj.style.color = 'blue';
        })
    }
</script>

</html>


